<template>
	<view>
		<view class="title">
			<view class="bl"></view>商家信息
		</view>
		<view class="dev-box base-info">
			<view class="info-item">
				<view class="text">岗位名称</view>
				<iInput v-model="job.jobName" type="text" maxlength="11" placeholder="请填写岗位名称"></iInput>
			</view>
			<view class="info-item">
				<view class="text">商家名称</view>
				<iInput v-model="job.name" type="text" placeholder="请填写商家名称"></iInput>
			</view>
			<view class="info-item">
				<view class="text">联系人</view>
				<iInput v-model="job.toName" type="text" placeholder="请填写联系人"></iInput>
			</view>
			<view class="info-item">
				<view class="text">联系电话</view>
				<iInput v-model="job.phone" type="text"  placeholder="请填写商家联系方式"></iInput>
			</view>
			<view class="info-item">
				<view class="text">备用电话</view>
				<iInput v-model="job.toPhone" type="text"  placeholder="请填写备用联系方式"></iInput>
			</view>
			<view class="info-item">
				<view class="text">联系微信</view>
				<iInput v-model="job.weix" type="text"  placeholder="请填写联系微信号"></iInput>
			</view>
			
			<view class="info-item">
				<view class="text">所属行业</view>
				<iInput v-model="job.trade" type="text" placeholder="请填写所属行业,如:餐饮"></iInput>
			</view>
			<view class="info-item">
				<view class="text">结算类型</view>
				<view class="select-box">
					<picker @change="selectType" :value="job.subType" :range="subTypeArray">
						<input class="padding-20" disabled="true" placeholder="请选择结算类型" :value="job.subType" style="margin-left:20upx"/>
					</picker>
					
				</view>
				<!-- <view class="select-box"  @click="selectType"><text :style="subType==''?'color:gray':''">{{subType==''?"请选择":subType}}</text></view> -->
			</view>
			<view class="info-item">
				<view class="text">人员要求</view>
				<iInput v-model="job.num" type="text" placeholder="请填写人员要求"></iInput>
			</view>
			<view class="info-item">
				<view class="text">时薪</view>
				<iInput v-model="job.salary" type="text" maxlength="11" placeholder="请填写时薪水元/小时"></iInput>
			</view>
			<view class="info-item">
				<view class="text">工作内容</view>
				<iInput v-model="job.content" type="text" maxlength="11" placeholder="请填写工作内容"></iInput>
			</view>
			<view class="info-item">
				<view class="text">工作时间</view>
				<iInput v-model="job.workTime" type="text" placeholder="请填写工作时间"></iInput>
			</view>
			<view class="info-item">
				<view class="text">所在市区</view>
				<view class="select-box"  @click="selectCity"><text :style="city==''?'color:gray':''">{{city==''?"请选择":city}}</text></view>
			</view>
			<view class="info-item">
				<view class="text">工作地点</view>
				<view class="select-box"  @tap="getLocation"><text :style="job.addressName==''?'color:gray':''">{{job.addressName==''?"工作地点名称":job.addressName}}</text></view>
			</view>
			<view class="info-item">
				<view class="text"></view>
				<view class="select-box"  ><text :style="job.address==''?'color:gray':''">{{job.address==''?"工作详细地址":job.address}}</text></view>
			</view>
			<view class="bus-img info-item" style="border:none;padding:0;margin-top:30rpx;">
				<view class="text" style="line-height: normal;">商家照片</view>
				<view class="space"></view>
			</view>
			<m-upimg count="3"></m-upimg>
		</view>
		<button class="submitBtn" @click="">立即提交</button>
		<mCity ref="mCity" @onConfirm="onConfirm"></mCity>
		
	</view>
</template>

<script>
	import iInput from '@/components/watch-login/info-input.vue'; //input
	import mUpimg from '@/components/m-upimg/m-upimg.1.vue'; //input
	import mCity from '@/components/mpvue-citypicker/mpvueCityPicker.vue';
	export default {
		components: {
			iInput,
			mUpimg,
			mCity
		},
		data() {
			return {
				city:"",
				job:{
					contacts:"",
					name:"",
					toName:"",
					phone:"",
					toPhone:"",
					num:"",
					subType:"",
					address:"",
					addressName:"",
					jobName:"",
					content:"",
					salary:"",
					trade:"",
					workTime:"",
					weix:""
				},
				
				subTypeArray:["日结","周结","月结"]
			}
		},
		onLoad(e) {
			console.log(e.id)
		},
		methods: {
			//获取验证码
			async getVerCode() {
				var myreg = /^[1][3,4,5,6,7,8,9][0-9]{9}$/;
				if (!myreg.test(this.phone)) {
					uni.showToast({
						icon: 'none',
						title: '请输入正确的手机号码',
						position: 'bottom' 
					});
					return false;
				}
				//触发倒计时（一般用于请求成功验证码后调用）
				this.$refs.runCode.$emit('runCode');
				let params = {
					phone: this.phone
				};
				let data = await this.$apis.getVerifyCode(params);
				console.log('getVerCode===', data);
				if (data) {
					uni.showToast({
						title: '获取成功',
						icon: 'none',
						position: 'bottom'
					});
				}
				//终止倒计时（用于突然需要终止倒计时的场景）
				this.$refs.runCode.$emit('runCode',0);
			},
			selectCity(){
				this.$refs.mCity.showPickerView();
			},
			selectType(e){
				this.subType = this.subTypeArray[e.target.value];
			},
			onConfirm(obj){
				this.city=obj.label
			},
			getLocation(){
				uni.choosePoi({
					  success: (res) => {
					    console.log('wx.chooseLocation res=', res)
					    uni.setStorageSync('currentLocation', res)
						this.address = res.address
						this.addressName = res.name
					  },
					  fail: function (err) {
					    console.log('取消按钮', err)
					  }
					})
			}
		}
	}
</script>

<style lang="scss">
.title {
	margin: 20upx 4% 20upx 4%;
	font-weight: bold;
	font-size: $font-size-34;
	line-height: 50upx;
	.bl{
		border-radius: 6upx;
		float:left;
		margin-right:20upx;
		background-color: #36B957;
		margin-top:5upx;
		height:40upx;
		width:10upx;
	}
		
}
.base-info{
	padding:0;
	.info-item{
		display: flex;
		border-bottom: 1px solid #F2F2F2;
		margin:0upx 25upx;
		padding: 10rpx 0;
		.text{
			text-align-last:justify;
			font-size: 28upx;
			flex:1;
			text-align: center;
			line-height: 76upx;
			font-weight: bold;
		}
		.select-box{
			flex: 4;
			background-image: url("@/static/img/icons-black.png");
			background-repeat: no-repeat;
			background-position: 95% 50%;
			background-size: 20upx 30upx;
			text{
				margin-left:40upx;
				font-size: 28upx;
				line-height: 76upx;
			}
		}
		i-input{
			flex: 4;
		}
		.space{
			flex: 4;
		}
	}
}
.submitBtn{
	
	margin: 40upx 4% 20upx 4%;
	width:92%;
	height:80upx;
	line-height: 80upx;
	color:white;
	border-radius: 35upx;
	background-color: #5FDB7E;
}
</style>
